import { fileURLToPath, URL } from "node:url";
import { defineConfig } from "vite";
// 路径解析
import { resolve } from "path";
import vue from "@vitejs/plugin-vue";
import vueDevTools from "vite-plugin-vue-devtools";
// 动态配置库
import { loadEnv } from "vite"; // VITE提供
// vue项目组件，读取指定的配置文件，解析数据
import dotenv from "dotenv"; // dotenv提供
// 自动装配组件依赖-实现组件自动import，vue项目插件
// npm i -D unplugin-vue-components
import Components from "unplugin-vue-components/vite"; // 引入自动导入插件
// import { VueLoader } from 'unplugin-vue-components/resolvers'; // 可选：自定义解析器

// 根据模式加载对应的 .env 文件
// 1.Vite方式加载：加载环境变量
console.log(process.env.NODE_ENV);
// 此加载方法只能使用VITE开头的变量
const env = loadEnv(process.env.NODE_ENV, process.cwd());
console.log("VITE:ENV", env);

// 2.指定文件方式加载
const envFile =
  process.env.NODE_ENV === "production"
    ? ".env.production"
    : ".env.development";
// 加载指定的 .env 文件
dotenv.config({
  path: envFile,
});

// 打印需要的 VITE_APP_BASE_API 值
console.log("VITE_APP_BASE_API:", process.env.VITE_APP_BASE_API);

// // 颜色管理 -- 失败
// import { colorManager, colorObject } from "./src/assets/scss/colors-util";
// console.log(colorManager.getColor("__primary_color"));

// https://vite.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    vueDevTools(),
    Components({
      // 自动扫描的目录，默认是 src/components
      dirs: ["src/components"],
      // 需要深度扫描子目录时
      deep: true,
      // 默认会自动导入 `.vue` 文件
      extensions: ["vue"],
      // 如果你使用其他组件库，可以在这里指定解析器
      // resolvers: [VueLoader()],
    }),
  ],
  // 全局变量定义
  define: {
    process: process, // 将配置定义为全局变量
    // colorObject: colorObject, // 无法传递ref
  },
  resolve: {
    alias: {
      // 方式1
      // "@": resolve(__dirname, "./src")
      "@": fileURLToPath(new URL("./src", import.meta.url)),
    },
  },
  css: {
    preprocessorOptions: {
      scss: {
        additionalData: `@use "@/assets/scss/colors.scss" as *;`,
      },
    },
  },
});
